{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# 本周内容(交互式数据可视化网站搭建)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## 回顾Flask"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [],
   "source": [
    "from bokeh import plotting\n",
    "from flask import Flask,render_template\n",
    "from bokeh.embed import components\n",
    "from bokeh.resources import INLINE\n",
    "from bokeh.plotting import figure"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "* hello显示"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {
    "scrolled": true
   },
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      " * Serving Flask app \"__main__\" (lazy loading)\n",
      " * Environment: production\n",
      "   WARNING: This is a development server. Do not use it in a production deployment.\n",
      "   Use a production WSGI server instead.\n",
      " * Debug mode: off\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      " * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)\n",
      "127.0.0.1 - - [11/May/2022 20:57:50] \"\u001b[37mGET / HTTP/1.1\u001b[0m\" 200 -\n"
     ]
    }
   ],
   "source": [
    "app = Flask(__name__)\n",
    "\n",
    "@app.route('/')  #页面路由(页面路径)\n",
    "def hello_world():\n",
    "    return render_template(\n",
    "    'index.html'\n",
    "    )\n",
    "    \n",
    "if __name__=='__main__':\n",
    "    app.run()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "* html页面显示"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      " * Serving Flask app \"__main__\" (lazy loading)\n",
      " * Environment: production\n",
      "   WARNING: This is a development server. Do not use it in a production deployment.\n",
      "   Use a production WSGI server instead.\n",
      " * Debug mode: off\n"
     ]
    },
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      " * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)\n",
      "127.0.0.1 - - [11/May/2022 21:03:22] \"\u001b[37mGET / HTTP/1.1\u001b[0m\" 200 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:27] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:27] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:28] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:28] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:29] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:30] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:30] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:31] \"\u001b[33mGET /root/ HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:34] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:03:34] \"\u001b[33mGET /root HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:02] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:02] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:03] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:03] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:04] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:05] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:05] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:06] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:07] \"\u001b[33mGET /favicon.ico HTTP/1.1\u001b[0m\" 404 -\n",
      "127.0.0.1 - - [11/May/2022 21:05:18] \"\u001b[37mGET /bokeh_demo HTTP/1.1\u001b[0m\" 200 -\n"
     ]
    }
   ],
   "source": [
    "app = Flask(__name__)\n",
    "\n",
    "@app.route('/')  #页面路由(页面路径)\n",
    "def hello_world():\n",
    "    return render_template(\n",
    "    'index.html'\n",
    "    )\n",
    "\n",
    "@app.route('/bokeh_demo')\n",
    "def bokeh_demo():\n",
    "    '''\n",
    "    bokeh绘制柱状图\n",
    "    '''\n",
    "    fig = figure(plot_width=300, plot_height=300)\n",
    "    fig.vbar(\n",
    "        x=[1, 2, 3, 4],\n",
    "        width=0.5,\n",
    "        bottom=0,\n",
    "        top=[1.7, 2.2, 4.6, 3.9],\n",
    "        color='navy'\n",
    "    )\n",
    "    \n",
    "    js_resources = INLINE.render_js()\n",
    "    css_resources = INLINE.render_css()\n",
    "    script, div = components(fig)\n",
    "    \n",
    "    html = render_template(\n",
    "        'index.html',\n",
    "        plot_script = script,\n",
    "        plot_div = div,\n",
    "        js_resources = js_resources,\n",
    "        css_resources = css_resources\n",
    "    )\n",
    "    return html\n",
    "    \n",
    "    \n",
    "\n",
    "if __name__ == '__main__':\n",
    "    app.run()"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Bokeh-flask Demo"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from bokeh import plotting\n",
    "from bokeh.ploting import show,figure,output_"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "from flask import Flask,render_template\n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.8.3"
  },
  "toc": {
   "base_numbering": 1,
   "nav_menu": {},
   "number_sections": true,
   "sideBar": true,
   "skip_h1_title": false,
   "title_cell": "Table of Contents",
   "title_sidebar": "Contents",
   "toc_cell": false,
   "toc_position": {},
   "toc_section_display": true,
   "toc_window_display": false
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}
